<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">

<title>Bootstrap 4, from LayoutIt!</title>

<meta name="description"
	content="Source code generated using layoutit.com">
<meta name="author" content="LayoutIt!">

<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">

</head>
<body>

	<div class="container-fluid">
		<div class="row">
			<div class="col-md-12">
				<table class="table">
					<thead>
						<tr>
							<th>编号</th>
							<th>国家</th>
							<th>首都编号</th>
						</tr>
					</thead>
					<tbody>
						<c:forEach var="country" items="${pageBean.list}" varStatus="status">
							<tr>
								<td>${country.code}</td>
								<td><a href="city?countryCode=${country.code}">${country.name}</a></td>
								<td><a href="city?id=${country.capital}">${country.capital}</td>
								</td>
							</tr>
						</c:forEach>
					</tbody>
				</table>
				<nav>
					<ul class="pagination">
						
						<c:choose>
							<c:when test="${pageBean.page==1}">
								<li class="page-item"><span class="page-link" >Previous</span>
							</c:when>
							<c:otherwise>
								<li class="page-item"><a class="page-link" href="country?page=${pageBean.page-1}">Previous</a>
							</c:otherwise>
						</c:choose>
						
						
						
						</li>
						<c:forEach var="i" begin="${pageBean.start}" end="${pageBean.end}" step="1">
						
								<c:choose>
									<c:when test="${i==pageBean.page}">
										<li class="page-item active"><span class="page-link " >${i}</span></li>
									</c:when>
									<c:otherwise>
										<li class="page-item"><a class="page-link" href="country?page=${i}">${i}</a></li>
									</c:otherwise>
								</c:choose>
						
							
						</c:forEach>
						
						<li class="page-item"><a class="page-link" href="country?page=${pageBean.page+1}">Next</a>
						</li>
					</ul>
				</nav>
			</div>
		</div>
	</div>

	<script src="js/jquery.min.js"></script>
	<script src="js/bootstrap.min.js"></script>
	<script src="js/scripts.js"></script>
</body>
</html>